<script lang="ts" setup>
import { watch } from 'vue'
import useStore from '../store'
const { newss, channels } = useStore()
//调用方法,需要传递过去频道id
newss.getArticleByChannelId(0)

//监听普通值应该用函数返回普通值
watch(
  () => channels.active,
  (channelsId) => {
    newss.getArticleByChannelId(channelsId)
  }
  // {
  //   immediate: true,
  // }
)
</script>

<template>
  <div className="list">
    <div
      className="article_item"
      v-for="item in newss.newsList"
      :key="item.art_id"
    >
      <!-- <h3 className="van-ellipsis">python数据预处理 ：数据标准化</h3> -->
      <h3 className="van-ellipsis">{{ item.title }}</h3>

      <!-- <div className="img_box">
        <img
          src="http://geek.itheima.net/resources/images/11.jpg"
          className="w100"
          alt=""
        />
      </div> -->
      <div className="img_box">
        <img
          :src="
            item.cover.images
              ? item.cover.images[0]
              : 'http://geek.itheima.net/resources/images/11.jpg'
          "
          className="w100"
          alt=""
        />
      </div>
      <div className="info_box">
        <span>{{ item.comm_count }}</span>
        <span>{{ item.comm_count }}评论</span>
        <span>{{ item.pubdate }}</span>
      </div>
    </div>
  </div>
</template>

<style scoed lang="less"></style>
